﻿@model IEnumerable<Ja.Mvc.Acdf.Models.PhotoViewModel>
<!-- Begin Modal -->
@section scripts {
    @Scripts.Render("~/bundles/fancybox")
    @Scripts.Render("~/bundles/tablesorter")

    <script type="text/javascript">
        $(document).ready(function () {
            $(".fancybox").fancybox({
                helpers: {
                    title: {
                        type: 'float',
                    },
                },
                openEffect: 'none',
                closeEffect: 'elastic',
                nextEffect: 'fade',
                prevEffect: 'fade',
            })
        });

        //$(".various").click(function () {
        //    var src = $(this).attr('src');
        //    $('#myModal').find('.img-rounded').attr('src', src);
        //    $('#myModal').modal('show');
        //});

        @*http://mottie.github.io/tablesorter/docs/example-widget-filter.html*@
        var sorting = [[0, 0], [1, 0]];

        // note: the square brackets around sorting are required!
        $("table").trigger("sorton", [sorting]);
        $("table#sortTableExample").tablesorter(
            {
                widthFixed: false,
                showProcessing: true,
                headers: {
                    0: { sorter: false, filter: false },    // disable first column

                    8: { sorter: false, filter: false },      // disable first column
                },
                widgets: ["filter"],
                widgetOptions: {
                    // css class applied to the table row containing the filters & the inputs within that row
                    filter_cssFilter: 'tablesorter-filter',

                    // filter widget: If there are child rows in the table (rows with class name from "cssChildRow" option)
                    // and this option is true and a match is found anywhere in the child row, then it will make that row
                    // visible; default is false
                    filter_childRows: false,

                    // Set this option to true to use the filter to find text from the start of the column
                    // So typing in "a" will find "albert" but not "frank", both have a's; default is false
                    filter_startsWith: false,
                },

            });

    </script>
}
@Html.Partial("_PhotoModalPartial")
<!-- End Modal -->
@using PagedList.Mvc;

@{
    ViewBag.Title = "Photos";
}

<h2>@ViewBag.Title</h2>

<p>
    @Html.ActionLink("Create New", "Create")
</p>
<div class="table-responsive">
    @*http://tablesorter.com/docs/*@
    <table id="sortTableExample" class="table table-striped table-bordered table-hover table-condensed tablesorter">
        <thead>
            <tr>
                <th>
                    @Html.DisplayNameFor(model => model.First().Path)
                </th>
                <th>
                    @Html.DisplayNameFor(model => model.First().Description)
                </th>
                <th>
                    @Html.DisplayNameFor(model => model.First().Place)
                </th>
                <th>
                    @Html.DisplayNameFor(model => model.First().UserName)
                </th>
                <th>
                    @Html.DisplayNameFor(model => model.First().CategoryName)
                </th>
                <th>
                    @Html.DisplayNameFor(model => model.First().SubCategoryName)
                </th>
                <th>
                    @Html.DisplayNameFor(model => model.First().SchoolPeriod)
                </th>
                <th>
                    @Html.DisplayNameFor(model => model.First().Date)
                </th>
                <th></th>
            </tr>
        </thead>
        <tbody>
            @foreach (var item in Model)
            {
                <tr>
                    <td>
                        @{string myTitle = item.Description + " : " + item.Place;}
                        <a class="fancybox" title="@myTitle" href="@item.Path"><img src="@item.ThumbPath" alt="" /></a>
                    </td>
                    <td>
                        @Html.TextAreaFor(modelItem => item.Description, new { rows = "4", disabled = "true" })
                    </td>

                    <td>
                        @Html.DisplayFor(modelItem => item.Place)
                    </td>
                    <td>
                        @Html.DisplayFor(modelItem => item.UserName)
                    </td>
                    <td>
                        @Html.DisplayFor(modelItem => item.CategoryName)
                    </td>
                    <td>
                        @Html.DisplayFor(modelItem => item.SubCategoryName)
                    </td>
                    <td>
                        @Html.DisplayFor(modelItem => item.SchoolPeriod)
                    </td>
                    <td>
                        @Html.DisplayFor(modelItem => item.Date)
                    </td>
                    <td>
                        <div class="btn-group-vertical">
                            @Html.ActionLink("Edit", "Edit", new { id = item.PhotoId }, new { type = "button", @class = "btn btn-xs btn-primary" })
                            @Html.ActionLink("Details", "Details", new { id = item.PhotoId }, new { type = "button", @class = "btn btn-xs" })
                            @Html.ActionLink("Delete", "Delete", new { id = item.PhotoId }, new { type = "button", @class = "btn btn-xs btn-danger" })
                        </div>
                    </td>
                </tr>
                            }
        </tbody>
    </table>

</div>
